<template>
    <div class="failure">
        <div class="title">
            <img src="../assets/img/定位-icon.png" alt="">
            <p>定位失败</p>
        </div>
        <div class="center">
                <img src="../assets/img/ic_search_no_data.png" alt="" class="bees">
                <p class="obtain">获取定位失败</p>
                <p class="service">您可进入系统开启定位服务</p>
                <button>开启定位</button>
                <router-link to="/Position" class="switch">手动切换城市</router-link>
        </div>
    </div>
</template>

<script>
import axios from "axios";
export default {
    name: "faliure",
}
</script>

<style scoped lang="scss">
    .failure{
        display:flex;
        align-items: center;
        width:100%;
        height:100vh;
        flex-direction: column;
        justify-content: center;
        .title{
            width:100%;
            height:0.4rem;
            display: flex;
            align-items: center;
            background: #FEF9EF;
            box-shadow: 0 1px 2px 0 rgba(204,204,204,0.50);
            img{
                width:0.16rem;
                height:0.16rem;
                margin:0 0.1rem 0 0.14rem;
            }
            p{
                font-family: PingFangSC-Regular;
                font-size: 0.14rem;
                color: #F09632;
                letter-spacing: -0.32px;
                line-height: 0.14rem;
            }
        }
        .center{
            display:flex;
            flex: 1;
            width:100%;
            background: #f8f8f8;
            flex-direction:column;
            align-items : center;
            margin-top:0.02rem;
            .bees{
                width:1rem;
                height:1rem;
                // border:1px solid blue;
                margin-top:1.76rem;
            }
            .obtain{
                font-family: PingFangSC-Regular;
                font-size:0.16rem;
                color: #333333;
                letter-spacing: -0.36px;
                line-height: 0.16rem;
                padding-top:0.3rem;
            }
            .service{
                font-family: PingFangSC-Regular;
                font-size: 0.12rem;
                color: #666666;
                letter-spacing: -0.27px;
                line-height: 0.5rem;
            }
            button{
                width:2.3rem;
                height:0.44rem;
                margin-top:0.3rem;
                border:none;
                border: 1px solid #DD3333;
                background: #f8f8f8;
                border-radius: 4px;
                font-family: PingFangSC-Regular;
                font-size: 18px;
                color: #DD3333;
                letter-spacing: -0.41px;
                line-height: 18px;
            }
            .switch{
                font-family: PingFangSC-Regular;
                font-size: 14px;
                color: #DD3333;
                letter-spacing: -0.32px;
                line-height:0.9rem;
            }
        }
    }
</style>

